<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
        <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="f" uri="http://51star.com/mytag/tag" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>oa人事系统</title>
<script type="text/javascript" src="static/easyui/themes/mainoa.js"></script>
 <script type="text/javascript" src="static/easyui/jquery.min.js"></script>
<script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/easyui/themes/metro-admin/easyui.css"> 
<link rel="stylesheet" href="static/easyui/themes/mainoa.css">
<link rel="icon" href="static/easyui/themes/icons/tx.jpg" type="image/x-icon">
</head>
<body>
<style type="text/css">

.title-message{
	float: right;
    width: 200px;
    height: 30px;
    margin: 22px 0 0 16px;
    font-size: 14px;
}
.title-left{
	color: rgba(26,179,148,1);
    font-weight: 700;
}
.title-right{
	color: #ccc;
}
#content-admin::-webkit-scrollbar,.ind_t_t2 ul::-webkit-scrollbar{
	width: 6px;
   	height: 1px;
}
#content-admin::-webkit-scrollbar-thumb,.ind_t_t2 ul::-webkit-scrollbar-thumb{
	border-radius: 8px;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: #19AA8D;
}
#content-admin::-webkit-scrollbar-track,.ind_t_t2 ul::-webkit-scrollbar-track{
    border-radius: 8px;
}
.cuowudiv{
		font-family: Monospaced Number,Chinese Quote,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;
	    font-size: 14px;
	    line-height: 1.5;
	    color: rgba(0,0,0,.65);
	    -webkit-box-sizing: border-box;
	    box-sizing: border-box;
	    margin: 0;
	    padding: 0;
	    list-style: none;
	    position: fixed;
	    z-index: 1500;
	    width: 100%;
	    top: 0px;
	    left: 0;
	    pointer-events: none;
	}
	.bug{
		width: 300px;
	    height: 30px;
	    color: #000;
	    margin:2px auto;
	    text-align: center;
	    line-height: 30px;
	    padding: 10px 16px;
	    border-radius: 4px;
	    box-shadow: 0 4px 12px rgba(0,0,0,.15);
	    background: #fff;
	    pointer-events: all;
	}
	.bug img{
		float: left;
	}
	.cuowu-tishi{
		font-size:13px;
	}
</style>
<div class="easyui-layout" data-options="fit:true">

 <div data-options="region:'west',collapsible:false" style="width:fit-content;">
<div id="menu">
 <script type="text/javascript">
			$(function(){
				$(".fun").click(function(){
					var i=$(this).attr("data-href");
					$("#content-admin").panel({
						href:i
						})
				})
			})
</script> 
<div id="ensconce" style="display: none;">
        <h2>
            <img src="" alt="">
            导航栏
        </h2>
    </div>
<div id="open" style="margin-left: 0px;">
        <div class="navH">
            	导航栏
            <span><img class="obscure" src="" alt=""></span>
        </div>
        <div class="navBox">
            <ul>
            
            	<c:forEach items="${fun1}" var="f1">
				    <f:fun funId="${f1.function_id}">
				    <li>
				    	<h2 class="obtain">${f1.function_name}<i class=""></i></h2>
				    	
					   	<div class="secondary" style="height: 0px;">
					   	<c:forEach items="${f1.funs}" var="f2">
					   	<f:fun funId="${f2.function_id}">
                        <h3 class="fun" data-id="${f2.function_id}" data-href="${f2.function_url}">${f2.function_name}</h3>
                 		</f:fun>
                 		</c:forEach>
                    	</div>
                    	
                    	</li>
				    </f:fun>
			    </c:forEach>
    		</ul>
    	</div>
</div>
</div>
</div>
<div region="center" class="easyui-panel">
		 	<div style="height:60px;border-bottom:solid 1px lightgrey;" data-options="fit:true">
			<div style="width:130px;height:100%;font-size:20px;text-align:center;line-height:60px;color:black;float:left">Decade公司</div>
			<div style="height:100%;width:290px;float:left">
				<div class="title-emp icon-title-emp" style="cursor: pointer;
    				margin: 16px 0 0 20px;width: 38px;height: 30px;line-height: 30px;text-align: center;float: left;
    				background-color: rgba(26,179,148,1);border-radius: 3px;"></div>
				<div class="title-message">
					<span class="title-left">员工自助</span>
					<span class="title-right"></span>
					<span class="title-right"></span> 
				</div>
			</div>
			<div style="height:100%;width:360px;float:right">
				<a class="main-daka" id="daka" style="padding: 4px 18px;background:#19AA8D;color:white;font-size:15px;display: inline-block;
    			margin: 12px;cursor:pointer;">打卡</a>
				<script type="text/javascript">
				function cuowu(text){
					var div=$("<div>");
					var img=$("<img>");
					var span=$("<span>");
					div.addClass("bug");
					img.attr("src","static/easyui/themes/icons/cuowu.png");
					span.addClass("cuowu-tishi");
					span.html(text);
					div.append(img);
					div.append(span);
					$(".cuowudiv").append(div);
					var timer=setTimeout(function () {
						div.slideUp("fast");
						div.remove();
					}, 2000);
				}
					$(function(){
						$("#daka").click(function(){
							var id=$("#yuangong_id").val();
							$.ajax({
								url: "kq_daka", 
								type : "post",
								data: "dakaid="+id,
								success: function(msg){
							    	if(msg==1){
							    		cuowu("打卡时间最多提前一个小时");
							    	}else if(msg==2){
							    		cuowu("请勿重复打卡");
							    	}else{
							    		alert(msg);
							    	}
								}
							});
						});
						
						$(".title-emp").click(function(){
							$("#content-admin").panel('open').panel('refresh','dome');
						});
					});
					
					//注销用户
					function exits(){
						var con;
						con=confirm("您确认退出系统?"); //在页面上弹出对话框
						if(con==true){
							location.href="zhuxiao"
						}else{
							
						}
					}
				</script>
				<div style="display: inline-block; width: 200px;height: 40px;float: right;margin: 9px;">
					<div style="float:left;"><img alt="" src="static/easyui/themes/icons/tx.jpg" style="width:40px;cursor:pointer;"></div>
					<div style="width:90px;height:40px;float:left;font-size:13px;">
						<div style="text-align:center;cursor:pointer;">${name}</div><div style="text-align:center;cursor:pointer;">${poin }</div>
					</div>
					<div style="float:left;margin-top:2px;margin-left:10px;cursor:pointer;" title="注销" onClick="exits()"><img alt="" src="static/easyui/themes/icons/tuichu.png"></div>
					<div style="position:absolute;width:"></div>
				</div>
			</div>
		</div>
		<div id="content-admin" style="overflow:auto;height:594px;width:100%;background:#F3F3F9">
				<jsp:include page="dome.jsp"></jsp:include>
		</div>
	
</div> 
</div>
<div class="cuowudiv">

</div>

</body>
</html>